"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));

var _jsxRuntime = require("react/jsx-runtime");

var _proProvider = require("@ant-design/pro-provider");

var _proUtils = require("@ant-design/pro-utils");

var _antdV = require("antd-v4");

var _classnames = _interopRequireDefault(require("classnames"));

var _react = _interopRequireWildcard(require("react"));

var _useMediaAntdQuery = _interopRequireDefault(require("use-media-antd-query"));

var _HeaderMenu = _interopRequireDefault(require("./HeaderMenu"));

require("./index.less");

/**
 * 获取配置区域 DOM Item
 *
 * @param setting 配置项
 */
function getSettingItem(setting) {
  if ( /*#__PURE__*/_react.default.isValidElement(setting)) {
    return setting;
  }

  if (setting) {
    var settingConfig = setting;
    var icon = settingConfig.icon,
        tooltip = settingConfig.tooltip,
        _onClick = settingConfig.onClick,
        key = settingConfig.key;

    if (icon && tooltip) {
      return (0, _jsxRuntime.jsx)(_antdV.Tooltip, {
        title: tooltip,
        children: (0, _jsxRuntime.jsx)("span", {
          onClick: function onClick() {
            if (_onClick) {
              _onClick(key);
            }
          },
          children: icon
        }, key)
      });
    }

    return icon;
  }

  return null;
}

var ListToolBarTabBar = function ListToolBarTabBar(_ref) {
  var prefixCls = _ref.prefixCls,
      _ref$tabs = _ref.tabs,
      tabs = _ref$tabs === void 0 ? {} : _ref$tabs,
      multipleLine = _ref.multipleLine,
      filtersNode = _ref.filtersNode;
  if (!multipleLine) return null;
  return (0, _jsxRuntime.jsx)("div", {
    className: "".concat(prefixCls, "-extra-line"),
    children: tabs.items && tabs.items.length ? (0, _jsxRuntime.jsx)(_antdV.Tabs, {
      activeKey: tabs.activeKey,
      onChange: tabs.onChange,
      tabBarExtraContent: filtersNode,
      children: tabs.items.map(function (tab, index) {
        return (0, _jsxRuntime.jsx)(_antdV.Tabs.TabPane, (0, _objectSpread2.default)({}, tab), tab.key || index);
      })
    }) : filtersNode
  });
};

var ListToolBar = function ListToolBar(_ref2) {
  var customizePrefixCls = _ref2.prefixCls,
      title = _ref2.title,
      subTitle = _ref2.subTitle,
      tooltip = _ref2.tooltip,
      className = _ref2.className,
      style = _ref2.style,
      search = _ref2.search,
      _onSearch = _ref2.onSearch,
      _ref2$multipleLine = _ref2.multipleLine,
      multipleLine = _ref2$multipleLine === void 0 ? false : _ref2$multipleLine,
      filter = _ref2.filter,
      _ref2$actions = _ref2.actions,
      actions = _ref2$actions === void 0 ? [] : _ref2$actions,
      _ref2$settings = _ref2.settings,
      settings = _ref2$settings === void 0 ? [] : _ref2$settings,
      _ref2$tabs = _ref2.tabs,
      tabs = _ref2$tabs === void 0 ? {} : _ref2$tabs,
      menu = _ref2.menu;
  var intl = (0, _proProvider.useIntl)();
  var colSize = (0, _useMediaAntdQuery.default)();
  var isMobile = colSize === 'sm' || colSize === 'xs';
  var placeholder = intl.getMessage('tableForm.inputPlaceholder', '请输入');
  /**
   * 获取搜索栏 DOM
   *
   * @param search 搜索框相关配置
   */

  var searchNode = (0, _react.useMemo)(function () {
    if (!search) {
      return null;
    }

    if ( /*#__PURE__*/_react.default.isValidElement(search)) {
      return search;
    }

    return (0, _jsxRuntime.jsx)(_antdV.Input.Search, (0, _objectSpread2.default)((0, _objectSpread2.default)({
      style: {
        width: 200
      },
      placeholder: placeholder
    }, search), {}, {
      onSearch: function onSearch() {
        var _search$onSearch;

        for (var _len = arguments.length, restParams = new Array(_len), _key = 0; _key < _len; _key++) {
          restParams[_key] = arguments[_key];
        }

        _onSearch === null || _onSearch === void 0 ? void 0 : _onSearch(restParams === null || restParams === void 0 ? void 0 : restParams[0]);
        (_search$onSearch = search.onSearch) === null || _search$onSearch === void 0 ? void 0 : _search$onSearch.call.apply(_search$onSearch, [search].concat(restParams));
      }
    }));
  }, [placeholder, _onSearch, search]);

  var _useContext = (0, _react.useContext)(_antdV.ConfigProvider.ConfigContext),
      getPrefixCls = _useContext.getPrefixCls;

  var prefixCls = getPrefixCls('pro-table-list-toolbar', customizePrefixCls);
  /** 轻量筛选组件 */

  var filtersNode = (0, _react.useMemo)(function () {
    if (filter) return (0, _jsxRuntime.jsx)("div", {
      className: "".concat(prefixCls, "-filter"),
      children: filter
    });
    return null;
  }, [filter, prefixCls]);
  /** 有没有 title，需要结合多个场景判断 */

  var hasTitle = (0, _react.useMemo)(function () {
    return menu || title || subTitle || tooltip;
  }, [menu, subTitle, title, tooltip]);
  /** 没有 key 的时候帮忙加一下 key 不加的话很烦人 */

  var actionDom = (0, _react.useMemo)(function () {
    if (!Array.isArray(actions)) {
      return actions;
    }

    if (actions.length < 1) {
      return null;
    }

    return (0, _jsxRuntime.jsx)(_antdV.Space, {
      align: "center",
      children: actions.map(function (action, index) {
        if (! /*#__PURE__*/_react.default.isValidElement(action)) {
          // eslint-disable-next-line react/no-array-index-key
          return (0, _jsxRuntime.jsx)(_react.default.Fragment, {
            children: action
          }, index);
        }

        return /*#__PURE__*/_react.default.cloneElement(action, (0, _objectSpread2.default)({
          // eslint-disable-next-line react/no-array-index-key
          key: index
        }, action === null || action === void 0 ? void 0 : action.props));
      })
    });
  }, [actions]);
  var hasRight = (0, _react.useMemo)(function () {
    return hasTitle && searchNode || !multipleLine && filtersNode || actionDom || (settings === null || settings === void 0 ? void 0 : settings.length);
  }, [actionDom, filtersNode, hasTitle, multipleLine, searchNode, settings === null || settings === void 0 ? void 0 : settings.length]);
  var hasLeft = (0, _react.useMemo)(function () {
    return tooltip || title || subTitle || menu || !hasTitle && searchNode;
  }, [hasTitle, menu, searchNode, subTitle, title, tooltip]);
  var leftTitleDom = (0, _react.useMemo)(function () {
    // 保留dom是为了占位，不然 right 就变到左边了
    if (!hasLeft && hasRight) {
      return (0, _jsxRuntime.jsx)("div", {
        className: "".concat(prefixCls, "-left")
      });
    } // 减少 space 的dom，渲染的时候能节省点性能


    if (!menu && (hasTitle || !searchNode)) {
      return (0, _jsxRuntime.jsx)("div", {
        className: "".concat(prefixCls, "-left"),
        children: (0, _jsxRuntime.jsx)("div", {
          className: "".concat(prefixCls, "-title"),
          children: (0, _jsxRuntime.jsx)(_proUtils.LabelIconTip, {
            tooltip: tooltip,
            label: title,
            subTitle: subTitle
          })
        })
      });
    }

    return (0, _jsxRuntime.jsxs)(_antdV.Space, {
      className: "".concat(prefixCls, "-left"),
      children: [(0, _jsxRuntime.jsx)("div", {
        className: "".concat(prefixCls, "-title"),
        children: (0, _jsxRuntime.jsx)(_proUtils.LabelIconTip, {
          tooltip: tooltip,
          label: title,
          subTitle: subTitle
        })
      }), menu && (0, _jsxRuntime.jsx)(_HeaderMenu.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, menu), {}, {
        prefixCls: prefixCls
      })), !hasTitle && searchNode ? (0, _jsxRuntime.jsx)("div", {
        className: "".concat(prefixCls, "-search"),
        children: searchNode
      }) : null]
    });
  }, [hasLeft, hasRight, hasTitle, menu, prefixCls, searchNode, subTitle, title, tooltip]);
  var rightTitleDom = (0, _react.useMemo)(function () {
    if (!hasRight) return null;
    return (0, _jsxRuntime.jsxs)(_antdV.Space, {
      className: "".concat(prefixCls, "-right"),
      direction: isMobile ? 'vertical' : 'horizontal',
      size: 16,
      align: isMobile ? 'end' : 'center',
      children: [hasTitle && searchNode ? (0, _jsxRuntime.jsx)("div", {
        className: "".concat(prefixCls, "-search"),
        children: searchNode
      }) : null, !multipleLine ? filtersNode : null, actionDom, (settings === null || settings === void 0 ? void 0 : settings.length) ? (0, _jsxRuntime.jsx)(_antdV.Space, {
        size: 12,
        align: "center",
        className: "".concat(prefixCls, "-setting-items"),
        children: settings.map(function (setting, index) {
          var settingItem = getSettingItem(setting);
          return (// eslint-disable-next-line react/no-array-index-key
            (0, _jsxRuntime.jsx)("div", {
              className: "".concat(prefixCls, "-setting-item"),
              children: settingItem
            }, index)
          );
        })
      }) : null]
    });
  }, [actionDom, isMobile, filtersNode, hasRight, hasTitle, multipleLine, prefixCls, searchNode, settings]);
  var titleNode = (0, _react.useMemo)(function () {
    if (!hasRight && !hasLeft) return null;
    var containerClassName = (0, _classnames.default)("".concat(prefixCls, "-container"), (0, _defineProperty2.default)({}, "".concat(prefixCls, "-container-mobile"), isMobile));
    return (0, _jsxRuntime.jsxs)("div", {
      className: containerClassName,
      children: [leftTitleDom, rightTitleDom]
    });
  }, [hasLeft, hasRight, isMobile, leftTitleDom, prefixCls, rightTitleDom]);
  return (0, _jsxRuntime.jsxs)("div", {
    style: style,
    className: (0, _classnames.default)("".concat(prefixCls), className),
    children: [titleNode, (0, _jsxRuntime.jsx)(ListToolBarTabBar, {
      filtersNode: filtersNode,
      prefixCls: prefixCls,
      tabs: tabs,
      multipleLine: multipleLine
    })]
  });
};

var _default = ListToolBar;
exports.default = _default;